// setTimeout(function() {

//     var canvas = {},
//         centerX = 0,
//         centerY = 0,
//         color = '',
//         containers = document.getElementsByClassName('material-design'),
//         context = {},
//         element = {},
//         radius = 0,

//         requestAnimFrame = function() {
//             return (
//                 window.requestAnimationFrame ||
//                 window.mozRequestAnimationFrame ||
//                 window.oRequestAnimationFrame ||
//                 window.msRequestAnimationFrame ||
//                 function(callback) {
//                     window.setTimeout(callback, 1000 / 60);
//                 }
//             );
//         }(),

//         init = function() {
//             containers = Array.prototype.slice.call(containers);
//             for (var i = 0; i < containers.length; i += 1) {
//                 canvas = document.createElement('canvas');
//                 canvas.style.cssText = "position:absolute;top:0;right:0;bottom:0;left:0;";
//                 canvas.addEventListener('click', press, false);
//                 containers[i].appendChild(canvas);
//                 canvas.style.width = '100%';
//                 canvas.style.height = '100%';
//                 canvas.width = canvas.offsetWidth;
//                 canvas.height = canvas.offsetHeight;
//             }
//         },

//         press = function(event) {
//             for (var i = 0; i < containers.length; i++) {
//                 containers[i].lastChild.getContext('2d').clearRect(0, 0, 1000, 1000);
//             }
//             color = event.toElement.parentElement.dataset.color;
//             element = event.toElement;
//             context = element.getContext('2d');
//             radius = 0;
//             centerX = event.offsetX;
//             centerY = event.offsetY;
//             // context.clearRect(0, 0, element.width, element.height);
//             draw1();
//         },

//         draw1 = function() {
//             context.beginPath();
//             context.arc(centerX, centerY, radius, 0, 2 * Math.PI, false);
//             context.fillStyle = color;
//             context.fill();
//             //这里是控制扩撒速度
//             radius += 1.8;
//             //这里 -35 去掉就是扩散整个按钮
//             if (radius < (element.width - 35)) {
//                 requestAnimFrame(draw1);
//             } else {
//                 context.clearRect(0, 0, 1000, 1000)
//             }
//         };

//     init();
// }, 800);